---
title: mdx语法
author: ajn404
pubDatetime: 2023-09-01T03:36:16Z
postSlug: 语法
featured: false
draft: false
tags:
  - synctax
description:
  "mdx语法大纲"
---

## 目录

## 折叠

```html
<details>
<summary>summary</summary>
content****
</details>
```

<details>
<summary>summary</summary>
content****
</details>


## 代码块

```js
console.log('js')
```

## 使用变量

export const title = {
    text:'MDX变量'
}

```ts
export const title = {
    text:'MDX变量'
}
```
> {title.text}

## 获取formatter的变量

```mdx
> {frontmatter.title}
```
> {frontmatter.title}

> {frontmatter.description}

> {frontmatter.tags}

> {frontmatter.pubDatetime}


## 表格

| 表头1 | 表头2 | 表头3 |
|-------|-------|-------|
| 内容1 | 内容2 | 内容3 |
| 内容4 | 内容5 | 内容6 |


```js
| 表头1 | 表头2 | 表头3 |
|-------|-------|-------|
| 内容1 | 内容2 | 内容3 |
| 内容4 | 内容5 | 内容6 |
```

## 摘抄

<fieldset>
  <legend>什么是****(gojs)</legend>
    <blockquote cite="https://gojs.net/latest/">
  <p> 引用的摘要：A Web Framework for Rapidly Building Interactive Diagrams</p>
  <footer><cite>https://gojs.net/latest/</cite></footer>
</blockquote>
</fieldset>

## react组件

- 渐变文字

import Text from '@components/react/UI/Text.tsx'

<Text  client:load>七月不远
性别的诞生不远
爱情不远————马鼻子下
湖泊含盐</Text>

```mdx
import Text from '@components/react/UI/Text.tsx'

<Text client:load>文字渐变色背景使用</Text>
```

- css-doodle

import Common from '@components/react/doodle/common.tsx';

<Common  client:load grid="5">
:doodle \{
    grid-gap: 1px;
    width: 100%;
    height: 8em;
}
background: #60569e;
</Common>



## 链接

- [markdown中使用数学公式](/mono_notes/posts/math)